import React from "react";
import UserCover from "./UserCover";
import UserSongList from "./UserSongList";
import Back from "../Components/Back";
import { GetUserPlaylist } from "../../../../api";
// import { GetUserPlaylistAll } from "../../../../api";
import { useEffect } from "react";
import { useNavigate } from "react-router-dom";
import { useState } from "react";

export default function UserPage() {
  // const [playlist,setPlaylist] = useState([])
  const [menu,setMenu] = useState([])
  const navigate = useNavigate()
  useEffect(() => {
    if(!localStorage.getItem('token')){
      navigate('/login')
    }else{
    GetUserPlaylist(1601487687)
      .then((res) => {
        console.log(res);
        const { playlist } = res;
        console.log(playlist);
        setMenu(playlist)
        return playlist;
      }).then((res)=>{

      })

    }
      // let arr =[]
      //  for(let i=0;i<=playlist.length;i++){
      //     return arr.push(GetUserPlaylistAll(playlist[i].id))
      //  }
      // .then((res) => {
      //   console.log(res);
      //    const data=GetUserPlaylistAll(res) ;
      //   console.log( data);
      // });

    // }).then((res)=>{
    //   console.log(res);
    // })
    // .catch((err) => {
    //   console.log(err);
    // });
  }, []);
  console.log(menu);

  return (
    <div id="userPage">
      <Back />
      <UserCover />
      <UserSongList menu={menu}/>
    </div>
  );
}
